<!DOCTYPE html>
<html lang="zh">
<head>
	<th:block th:include="include :: header('拖动排序')" />
	
	<th:block th:include="include :: ztree-css" />
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content  animated fadeInRight">
        <div class="row">
            <!-- <div class="col-sm-4">
                <div class="ibox">
                    <div class="ibox-content">
						<div class="treeSearchInput" id="searchPlace">
							<input type="text" class="empty" id="keywordPlace" maxlength="50" placeholder="请输入关键字">
							<a class="btn btn-outline btn-success btn-sm " id="btnPlace" >
			                     添加
			                </a>
			                <a class="btn btn-outline btn-success btn-sm " id="btnPlaceUpdate" >
			                     修改
			                </a>
						</div>
                        <div id="placeTree" class="ztree"></div>
                    </div>
                </div>
            </div> -->
            <div class="col-sm-8">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="treeSearchInput" id="searchTeam">
							<input type="text" class="empty" id="keywordTeam" maxlength="50" placeholder="请输入关键字">
							<a class="btn btn-outline btn-success btn-sm " id="btnTeam" >
			                     添加
			                </a>
			                <a class="btn btn-outline btn-success btn-sm " id="btnTeamUpdate" >
			                     修改
			                </a>
						</div>
                        <div id="teamTree" class="ztree"></div>
                    </div>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="ibox">
                    <div class="ibox-content">
                    	<div class="treeSearchInput" id="searchUser">
							<input type="text" class="empty" id="keywordUser" maxlength="50" placeholder="请输入关键字">
							<!-- <button class="btn" id="btn" onclick="$.tree.searchNode()"> 搜索 </button> -->
							
				            <a class="btn btn-white multiple disabled" id="msgMultiple"  >
				                    <i class="fa fa-edit"></i> 发送短信
				            </a>
							<a class="btn btn-outline btn-success btn-sm " id="btnUser" >
			                     添加
			                </a>
			                <a class="btn btn-outline btn-success btn-sm " id="btnUserUpdate" >
			                     修改
			                </a>
							<a class="btn btn-outline btn-success btn-sm " id="btnSave" >
			                     保存分组
			                </a>
						</div>
                        <div id="userTree" class="ztree"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
	<th:block th:include="include :: ztree-js" />
    <script>
    var placeTree = null;
    var teamTree = null;
    var userTree = null;
    //queryPlaceTree();
    $("#btnPlace").click(function(){
    	$.modal.open('添加场所', ctx + "fym/place/add");//回调函数
    })
    $("#btnPlaceUpdate").click(function(){
    	var nodes = placeTree.getCheckedNodes(true);
    	if(nodes==null||nodes.length==0){
    		return $.modal.alertWarning('请先选中场所再编辑');
    	}
    	$.modal.open('编辑场所', ctx + "fym/place/edit/"+nodes[0].id);//回调函数
    })
	//     场所ztree
    function queryPlaceTree(placeAddr)
	{
    	console.log("queryPlaceTree",placeAddr);
    	$.ajax({
			type: "post",
			url: ctx + "fym/place/treeData",
			data: {
			},
			success: function(data) {
				console.log("data:",data);
				var setting = {
					check: {
						enable: true,
						chkStyle: "radio",
						radioType: "level"
					},
					data: {
						key: {
                            title: "title"         // 节点数据保存节点提示信息的属性名称
                        },
						simpleData: {
							enable: true
						}
					}
				};
				placeTree = $.fn.zTree.init($("#placeTree"), setting,data);
				var nodes = placeTree.getNodes();
				disabledNode('placeTree',false);
				for (var i=0, l=nodes.length; i < l; i++) {
					//console.log(nodes[i]);
					if(placeAddr==nodes[i].title){
						placeTree.checkNode(nodes[i], true, true,true);
						break;
					}
				}
				fuzzySearch('placeTree','#keywordPlace',null,true); 

				disabledNode('placeTree',true);
			}
		});
		
	}
//  队伍ztree
    queryTeamTree();
    $("#btnTeam").click(function(){
    	$.modal.open('添加队伍', ctx + "fym/team/add");//回调函数
    })
    $("#btnTeamUpdate").click(function(){
    	var nodes = teamTree.getCheckedNodes(true);
    	if(nodes==null||nodes.length==0){
    		return $.modal.alertWarning('请先选中队伍再编辑');
    	}
    	$.modal.open('编辑队伍', ctx + "fym/team/edit/"+nodes[0].id);//回调函数
    })
    function timeoutQueryTeamTree(){
    	setTimeout("queryTeamTree(null,null,null)",500);
    }
    
    function queryTeamTree(event, treeId, treeNode)
	{
    	console.log("queryTeamTree","我看看有没有被调用");
    	var placeId = "",checked=false;
    	//console.log("teamTreeNode",treeNode);
		if(treeNode){
			placeId = treeNode.id;
			checked = treeNode.checked;
		}
    	$.ajax({
			type: "post",
			url: ctx + "fym/team/treeData",
			data: {
				placeId:placeId,
				checked:checked
			},
			success: function(data) {
				var setting = {
					check: {
						enable: true,
						chkStyle: "radio",
						radioType: "level"
					},
					data: {
						key: {
                            title: "title"         // 节点数据保存节点提示信息的属性名称
                        },
						simpleData: {
							enable: true
						}
					},
					callback: {
						onCheck: teamTreeCheck,
						//点击名称，勾选项目
						onClick: function(event, treeId, treeNode,clickFlag){
							var treeObj = $.fn.zTree.getZTreeObj("teamTree");
							treeObj.checkNode(treeNode, true, true);
							queryUserTree(event, treeId, treeNode);
						}
					}
				};
				teamTree = $.fn.zTree.init($("#teamTree"), setting,data);
				fuzzySearch('teamTree','#keywordTeam',null,true);
			}
		});
	}
    
    function teamTreeCheck(event, treeId, treeNode){
    	queryUserTree(event, treeId, treeNode);
    	//queryPlaceTree(treeNode.title);
    }
	//  人员ztree
    queryUserTree();
	$("#btnUser").click(function(){
    	$.modal.open('添加人员', ctx + "fym/user/add");//回调函数
    })
    $("#btnUserUpdate").click(function(){
    	var nodes = userTree.getCheckedNodes(true);
    	if(nodes==null||nodes.length!=1){
    		return $.modal.alertWarning('请先勾选一个人员进行编辑，有且仅有一个');
    	}
    	$.modal.open('编辑人员', ctx + "fym/user/edit/"+nodes[0].id);//回调函数
    })
    $("#msgMultiple").click(function(){
    	var nodes = userTree.getCheckedNodes(true);
    	var userIds = "";
    	for(var i in nodes){
    		userIds+=nodes[i].id+",";
    	}
    	$.modal.open('批量发送短信', ctx + "fym/user/sendMsgMultiple/"+userIds);//回调函数
    })
    $("#btnSave").click(function(){
    	//保存队伍跟人员的分配信息，批量更新人员队伍对应关系
    	//获取当前队伍id
    	var teamNodes = teamTree.getCheckedNodes(true);
    	if(teamNodes.length==0){
    		return $.modal.alertWarning('请先选中队伍');
    	}
    	//获取当前人员ids
    	var userNodes = userTree.getCheckedNodes(true);
    	if(userNodes.length==0){
    		return $.modal.alertWarning('请先选中人员');
    	}
    	var userIds = "";
    	for (var i=0, l=userNodes.length; i<l; i++) {
    		userIds += userNodes[i].id+",";
		}
    	
    	//批量执行更新
    	$.ajax({
			type: "post",
			url: ctx + "fym/user/batchEdit",
			data: {
				teamId:teamNodes[0].id,
				userIds:userIds
			},
			success: function(data) {
				return $.modal.alert('操作成功');
			}
		});
    })
    function timeoutQueryUserTree(){
		setTimeout("queryUserTree(null,null,null)",500);
	}
    function queryUserTree(event, treeId, treeNode)
	{
		//console.log("queryUserTree",treeId,treeNode);
		var teamId = "",checked=false;
		if(treeNode){
			teamId = treeNode.id;
			checked = treeNode.checked;
		}
    	$.ajax({
			type: "post",
			url: ctx + "fym/user/treeData",
			data: {
				teamId:teamId,
				checked:checked
			},
			success: function(data) {
				//console.log(data);
				var setting = {
					check: {
						enable: true
					},
					data: {
						simpleData: {
							enable: true
						}
					},
					callback: {
						onCheck: function(event, treeId, treeNode){
							var nodes =  $.fn.zTree.getZTreeObj("userTree").getCheckedNodes(true);
							console.log(nodes);
				            $('#msgMultiple').toggleClass('disabled', !nodes.length);
						}
					}
				};
				userTree = $.fn.zTree.init($("#userTree"), setting,data);
				
				var nodes = userTree.getNodes();
				for (var i=0, l=nodes.length; i < l; i++) {
					//console.log(nodes[i]);
					//treeObj.checkNode(nodes[i], true, true);
				}
				fuzzySearch('userTree','#keywordUser',null,true);
			}
		});
	}
    
	    $(document).ready(function () {
	        $(".sortable-list").sortable({connectWith: ".connectList"}).disableSelection();
	    });
	    

	    function disabledNode(id,disabled) {
			var zTree = $.fn.zTree.getZTreeObj(id),
			nodes = zTree.getNodes();

			for (var i=0, l=nodes.length; i<l; i++) {
				zTree.setChkDisabled(nodes[i], disabled);
			}
		}
	    
		/* fuzzySearch('teamTree','#keywordTeam',null,true);
		fuzzySearch('userTree','#keywordUser',null,true); */
    </script>
</body>
</html>
